;(function(){
    window.onload = function(){
       slideObj();
    };
    function slideObj(){
         //创建滑动图片对象初始化
        var mySwiper = new Swiper(".swiper-container",{
            loop:true,
            pagination:".swiper-pagination",
            paginationClickable:true,
            onInit:function(swiper){
                swiper.container[0].style.height = window.innerHeight - 156 + "px";
            }
        });
        var swpSlids = mySwiper.container[0].getElementsByClassName("swiper-slide");
        //滑动图片的排版
        var slideImg2 = swpSlids[1].getElementsByTagName("img")[0];
        slideImg2.onload = function(){1};
        slideImg2.style.opacity = "0";
        swpSlids[0].getElementsByTagName("img")[0].onload = function(){
            slideImg2.style.opacity = "1";
            loading.style.display = "none";
            for(var i=0,l=swpSlids.length;i<l;i++){
                var sld_img = swpSlids[i].getElementsByTagName("img")[0];
                sld_img.style.display = "block";
                var diffHei = sld_img.offsetTop + 10 + sld_img.offsetHeight - sld_img.parentNode.getElementsByTagName("figcaption")[0].offsetTop;
                if(diffHei > 0){
                    sld_img.style.height = sld_img.offsetHeight - diffHei + "px";
                }else{
                    sld_img.style.paddingTop = sld_img.style.paddingBottom = 0 - diffHei / 2 + "px";
                }
            }   
        }

        //创建loading动画
        var loading = (function(){
            var svgns = "http://www.w3.org/2000/svg";
            var svgElm = document.createElementNS(svgns,"svg");
            var path1 = document.createElementNS(svgns,"path");
            var path2 = document.createElementNS(svgns,"path");
            var anim = document.createElementNS(svgns,"animateTransform");
            var setAttr = function(elem,attr){
                for(name in attr){
                    elem.setAttribute(name,attr[name]);
                }
            };
            setAttr(svgElm,{
                viewBox : "0 0 32 32",
                width : "32",
                height : "32",
                fill : "#333"
            });
            setAttr(path1,{
                opacity : ".25",
                d : "M16 0 A16 16 0 0 0 16 32 A16 16 0 0 0 16 0 M16 4 A12 12 0 0 1 16 28 A12 12 0 0 1 16 4",
            });
            setAttr(path2,{
                transform : "rotate(127.883 16 16)",
                d : "M16 0 A16 16 0 0 1 32 16 L28 16 A12 12 0 0 0 16 4z",
            });
            setAttr(anim,{
                attributeName : "transform",
                type : "rotate",
                from : "0 16 16",
                to : "360 16 16",
                dur : "0.8s",
                repeatCount : "indefinite"
            });
            svgElm.appendChild(path1);
            svgElm.appendChild(path2);
            path2.appendChild(anim);
            return svgElm;
        })();
        loading.style.cssText = "position:absolute;width:10%;height:10%;top:45%;left:45%;z-index:20000;";
        document.body.appendChild(loading);

        //点击图片放大效果
        var maskLay = document.createElement("div");
        maskLay.style.backgroundColor = "rgba(0,0,0,0.7)";
        maskLay.style.width = "100%";
        maskLay.style.height = window.innerHeight + "px";
        maskLay.style.display = "block";
        maskLay.style.position = "fixed";
        maskLay.style.display = "none";
        maskLay.style.zIndex = 1000;
        maskLay.style.top = "0px";
        maskLay.style.backgroundSize = "contain";
        maskLay.style.backgroundRepeat = "no-repeat";
        maskLay.style.backgroundPosition = "center";
        maskLay.style.border = "10px solid rgba(0,0,0,0)";
        maskLay.style.boxSizing = "border-box";
        document.body.appendChild(maskLay);
        maskLay.onclick = function(){
            maskLay.style.display = "none";
            return false;
        };
        for(var i=0,l=swpSlids.length;i<l;i++){
            (function(index){
                var _index = index;
                var slideImg = swpSlids[i].getElementsByTagName("img")[0];
                slideImg.onclick = function(){
                    maskLay.style.backgroundImage = "url(" + this.src + ")";
                    maskLay.style.display = "block";
                };
            })(i);
        }

    }
})();